<!-- 封装弹出框 -->
<template>
  <el-drawer
    v-model="flag"
    :append-to-body="true"
    :destroy-on-close="true"
    :modal-append-to-body="false"
    :title="title"
    size="50%"
  >
    <slot></slot>
    <template #footer>
      <el-button @click="flag = false">取消</el-button>
      <el-button type="primary" @click="confirmClick">确认</el-button>
    </template>
  </el-drawer>
</template>
<script setup name="YDrawer" lang="ts">
import { ref } from 'vue';

// 控制弹框显示与隐藏
defineProps({
  title: {
    type: String,
    default: '',
    required: true,
  },
}); // 弹框控制
const emit = defineEmits(['confirm']);
const flag = ref(false); // 确认按钮
const confirmClick = () => {
  emit('confirm');
};
defineExpose({
  changeflag: () => {
    flag.value = !flag.value;
  },
});
</script>
